<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>收藏夹</title>
    <link rel="stylesheet" href="../plugins/bootstrap/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="../css/favorite.css"/>
    <script src="../plugins/bootstrap/js/bootstrap.min.js"></script>
</head>
<body>

导航栏

<div class="container-fluid head">
    <div class="container">

        <div class="log">
            收藏夹
        </div>
        <div class="types">
            <ul>
                <li>
                    <div class="choose">
                        普通商品
                    </div>
                </li>
                <li>
                    <div class="choose">
                        团购商品
                    </div>
                </li>
                <li>
                    <div class="choose">
                        秒杀商品
                    </div>
                </li>
            </ul>
        </div>

        <div class="search">
            <div style="margin-top: 20px">
                <form class="bs-example bs-example-form" role="form">
                    <div class="row" style="display: inline-block;width: 260px">
                        <div class="col-md-12">
                            <div class="input-group">
                                <input type="text" class="form-control">
                                <span class="input-group-btn">
                            <button class="btn btn-default" type="button">搜索</button>
                        </span>
                            </div><!-- /input-group -->
                        </div><!-- /.col-lg-6 -->
                    </div><!-- /.row -->
                </form>
            </div>
        </div>

    </div>
</div>

<div class="container">
    <div class="body">
        <div class="none">
            <img src="../images/收藏.png" alt="图片加载失败">
            <div class="body-info">
                还没有收藏过宝贝哦！快去 <a href="">逛逛</a> 吧
            </div>

        </div>

    </div>
</div>






<script src="../plugins/jquery/jquery-3.4.1.js"></script>
<script>
    $('.choose').hover(
        function () {
            $(this).addClass('choosefunction')
        },function () {
            $(this).removeClass('choosefunction')
        });

    $('.types li').click(function () {
        $('.types li').eq($(this).index()).css('background-color','#DE3B00').siblings().css('background-color','#FF4400')
    });


</script>
</body>
</html>